<template>
	<custom-condition-filter-layout @reset="onReset" @submit="onSubmit">
		<custom-filter-layout-item label="报修时间">
			<custom-date-range @change="setRepairDate" :startTime="queryData.repairStartTime"
				:end-time="queryData.repairEndTime"></custom-date-range>
		</custom-filter-layout-item>
		<custom-filter-layout-item label="完成时间">
			<custom-date-range @change="setCompleteDate" :startTime="queryData.completeStartTime"
				:end-time="queryData.completeEndTime"></custom-date-range>
		</custom-filter-layout-item>


		<custom-filter-layout-item label="报修科室" showFilterButton @filter="onFilterDept">
			<fui-tag v-for="(item,index) in labelDeptIdList" :key="index" :text="item.label" class="tag" theme="light">
				<view class="fui-close__icon" @click="delDeptIdList(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>
		<custom-filter-layout-item label="建单人" showFilterButton @filter="onFilterUser">
			<fui-tag theme="light" class="tag" v-for="(item,index) in labelBuildIdList" :key="index" :text="item.name">
				<view class="fui-close__icon" @click="DelBuildIdList(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>

		<custom-filter-layout-item label="处理科室" showFilterButton @filter="onFilterDep">
			<fui-tag v-for="(item,index) in labelDept" :text="item.label" class="tag" :key="index" theme="light">
				<view class="fui-close__icon" @click="delHandleDept(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>
		<custom-filter-layout-item label="处理小组" showFilterButton @filter="onFilterHandleTeam">
			<fui-tag v-for="(item,index) in labelHandleTeam" :text="item.label" class="tag" :key="index" theme="light">
				<view class="fui-close__icon" @click="delHandleTeam(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>
		<custom-filter-layout-item label="处理人" showFilterButton @filter="onFilterHandleUser">
			<fui-tag v-for="(item,index) in labelHandleUser" :text="item.name" class="tag" :key="index" theme="light">
				<view class="fui-close__icon" @click="delHandleUser(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>
		<custom-filter-layout-item label="故障分类" showFilterButton @filter="onFilterDicFault">
			<fui-tag v-for="(item,index) in labelFaultTypeList" :text="item.label" class="tag" theme="light">
				<view class="fui-close__icon" @click="delFaultTypeList(index)">
					<fui-icon name="close" color="#0052D9" :size="32"></fui-icon>
				</view>
			</fui-tag>
		</custom-filter-layout-item>
	</custom-condition-filter-layout>
</template>

<script>
	import {
		DeptSelectChoseType,
		toDeptSelectPage,
		toDicSelectPage,
		toTeamSelectPage,
		toUserSelectPage
	} from '../../utils/util'
	import {
		mapWritableState,
		mapState,
		mapActions
	} from 'pinia'
	import {
		useWorkOrderReview
	} from '../../store/modules/workOrderReview'
	import {
		FormDeptStoreKey,
		FormDicStoreKey,
		FormTeamStoreKey,
		FormUserStoreKey
	} from '../../store/sotreKey'
	import {
		useSelectUserPageStore
	} from '../../store/modules/selectUserPage'
	import _ from 'lodash'
	import {
		useDeptStore
	} from '../../store/modules/dept'
	import {
		keyDept,
		keyTeam,
		keyUser
	} from '../../utils/handleDeptData'
	import {
		DIC_KEY
	} from '../../config/dicKey-config'
	import {
		useDictStore
	} from '../../store/modules/dic'
	import {
		SubPages
	} from '../../config/router-config'
	import {
		useTeamUserStore
	} from '../../store/modules/teamUser'
	import {
		useTeamStore
	} from '../../store/modules/team'
	export default {
		data() {
			return {

			}
		},
		computed: {
			...mapWritableState(useWorkOrderReview, ['queryData']),
			...mapState(useSelectUserPageStore, ['userStoreKey', 'delUserStoreKeyValue', 'clearUserStoreKeyValue']),
			...mapState(useDeptStore, ['deptStoreKey']),
			...mapState(useDictStore, ['dicStoreKey']),
			...mapState(useTeamStore, ['teamStoreKey', 'clearTeamStoreKeyValue']),

			// 建单人
			labelBuildIdList() {
				const {
					value
				} = this.userStoreKey[FormUserStoreKey.WorkOrderBuildIdList.key]
				const parsedArray = _.map(value, jsonString => JSON.parse(jsonString));
				this.queryData.buildIdList = _.map(parsedArray, 'value')
				return parsedArray
			},
			// 报修科室
			labelDeptIdList() {
				const {
					value,
				} = this.deptStoreKey[FormDeptStoreKey.WorkOrderReviewDept.key]
				if (value.length) {
					const v = _.map(value, item => JSON.parse(item))
					this.queryData.deptIdList = _.map(v, 'value')
					return v
				}
				this.queryData.deptIdList = []
				return value
			},
			// 处理科室
			labelDept() {
				const {
					value,
				} = this.deptStoreKey[FormDeptStoreKey.WorkOrderReviewHandleDept.key]
				if (value.length) {
					const v = _.map(value, item => JSON.parse(item))
					this.queryData.makeDeptIdList = _.map(v, 'value')
					return v
				}
				this.queryData.makeDeptIdList = []
				return []
			},
			// 处理小组
			labelHandleTeam() {
				const {
					value
				} = this.teamStoreKey[FormTeamStoreKey.WorkOrderReviewHandleTeam.key]
				if (value.length) {
					const v = _.map(value, item => JSON.parse(item))
					this.queryData.makeTeamIdList = _.map(v, 'value')
					return v
				}
				this.queryData.makeTeamIdList = []
				return []
			},
			// 处理人
			labelHandleUser() {
				const {
					value
				} = this.userStoreKey[FormUserStoreKey.WorkOrderReviewHandleUser.key]
				if (value.length) {
					const v = _.map(value, item => JSON.parse(item))
					this.queryData.makeUserIdList = _.map(v, 'value')
					return v
				}
				this.queryData.makeUserIdList = []
				return []
			},

			// 故障分类
			labelFaultTypeList() {
				const {
					value
				} = this.dicStoreKey[FormDicStoreKey.WorkOrderReviewFaultType.key]
				if (value.length) {
					const v = _.map(value, item => JSON.parse(item))
					this.queryData.faultTypeList = _.map(v, 'value')
					return v
				}
				this.queryData.faultTypeList = []
				return []
			},



		},
		methods: {
			...mapActions(useDeptStore, ['delValue', 'clearDeptStoreKeyValue']),
			...mapActions(useDictStore, ['delDicValue', 'clearDicStoreKeyValue']),
			...mapActions(useSelectUserPageStore, ['clearUserStoreKeyValue']),
			...mapActions(useTeamStore, ['delTeamStoreKeyValue']),
			setRepairDate(date) {
				this.queryData.repairStartTime = date[0]
				this.queryData.repairEndTime = date[1]
			},
			setCompleteDate(date) {
				this.queryData.completeStartTime = date[0]
				this.queryData.completeEndTime = date[1]
			},
			// 删除简单人
			DelBuildIdList(index) {
				this.delUserStoreKeyValue(index, FormUserStoreKey.WorkOrderBuildIdList.key)
			},

			// 报修科室
			onFilterDept() {
				toDeptSelectPage(FormDeptStoreKey.WorkOrderReviewDept.key, DeptSelectChoseType.selectDept)
			},
			// 删除报修科室
			delDeptIdList(index) {
				this.delValue(index, FormDeptStoreKey.WorkOrderReviewDept.key)
			},
			// 删除处理小组
			delHandleTeam(index) {
				console.log(index, );
				this.delTeamStoreKeyValue(index, FormTeamStoreKey.WorkOrderReviewHandleTeam.key)
			},

			//建单人
			onFilterUser() {
				toUserSelectPage(FormUserStoreKey.WorkOrderBuildIdList.key)
			},
			// 处理人
			onFilterHandleUser() {
				toUserSelectPage(FormUserStoreKey.WorkOrderReviewHandleUser.key)
			},

			// 处理科室
			onFilterDep() {
				toDeptSelectPage(FormDeptStoreKey.WorkOrderReviewHandleDept.key, DeptSelectChoseType.selectDept)
			},
			// 处理小组
			onFilterHandleTeam() {
				toTeamSelectPage(FormTeamStoreKey.WorkOrderReviewHandleTeam.key, true)
			},
			// 删除处理科室
			delHandleDept(index) {
				this.delValue(index, FormDeptStoreKey.WorkOrderReviewHandleDept.key)
			},
			// 删除处理人
			delHandleUser(index) {
				this.delUserStoreKeyValue(index, FormUserStoreKey.WorkOrderReviewHandleUser.key)
			},
			// 故障分类
			onFilterDicFault() {
				toDicSelectPage(FormDicStoreKey.WorkOrderReviewFaultType.key, DIC_KEY.obs_fault_type)
			},
			// 删除某个故障分类
			delFaultTypeList(index) {
				this.delDicValue(index, FormDicStoreKey.WorkOrderReviewFaultType.key)
			},
			onReset() {
				this.clearDeptStoreKeyValue(FormDeptStoreKey.WorkOrderReviewDept.key)
				this.clearUserStoreKeyValue(FormUserStoreKey.WorkOrderBuildIdList.key)
				this.clearDeptStoreKeyValue(FormDeptStoreKey.WorkOrderReviewHandleDept.key)
				this.clearTeamStoreKeyValue(FormTeamStoreKey.WorkOrderReviewHandleTeam.key)
				this.clearUserStoreKeyValue(FormUserStoreKey.WorkOrderReviewHandleUser.key)
				this.clearDicStoreKeyValue(FormDicStoreKey.WorkOrderReviewFaultType.key)
				useWorkOrderReview().$reset()
				// this.queryData = {
				// 	pageNum: 1,
				// 	pageSize: 10,
				// 	keywords: '',
				// 	//  建单人ID多选
				// 	buildIdList: [],
				// 	//  完成结束日期(yyyy-MM-dd)
				// 	completeEndTime: '',
				// 	//  完成开始日期(yyyy-MM-dd)
				// 	completeStartTime: '',
				// 	//  报修科室ID多选
				// 	deptIdList: [],
				// 	//  故障分类多选
				// 	faultTypeList: [],
				// 	//  处理科室ID多选
				// 	makeDeptIdList: [],
				// 	//  处理小组ID多选
				// 	makeTeamIdList: [],
				// 	//  处理人ID多选
				// 	makeUserIdList: [],
				// 	//  报修结束日期(yyyy-MM-dd)
				// 	repairEndTime: '',
				// 	//  报修开始日期(yyyy-MM-dd)
				// 	repairStartTime: '',
				// }
			},
			onSubmit() {
				uni.redirectTo({
					url: SubPages.WORK_ORDER_REVIEW_INDEX.router
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.tag {
		margin-right: 16rpx !important;
		margin-bottom: 16rpx !important;
	}
</style>